<template>
	<view>
		<view class="name" style="display: flex;
    margin-top: 10px;
    justify-content: flex-start;
    align-items: stretch;">
			<image style="height: 45px; width: 45px; border-radius: 50%;" src="../../static/logo.png" mode=""></image>
			<view class="text">
				<text style="font-weight: bold;"> {{clubDetail.studentName}}</text>
				<text style="    font-size: smaller;"> {{clubDetail.creatTime}}</text>
			</view>
		</view>
		<view class="title" style=" font-weight: bold;text-align: center; font-size: 24px;margin-top: 10px;">
			{{clubDetail.motif}}
		</view>
		<view class="bottom">
			<rich-text :nodes="clubDetail.content"></rich-text>
		</view>
	</view>
</template>

<script>
	import server from '@/util/http.js'
	export default {
		data() {
			return {
				clubDetail: []
			}
		},
		methods: {

		},
		onLoad(option) {
			server({
				url: 'http://101.43.227.220:3004/topic/all',
				method: 'post',
				success: res => {
					let data = res.data;
					console.log(data);
					let m = data.filter(value => value.id === Number(option.id));
					this.clubDetail = m[0];
				},
				fail: e => {
					console.log(e);
				}
			})
		}
	}
</script>

<style>
	.text {
		display: flex;
		flex-wrap: nowrap;
		flex-direction: column;
	}

	.bottom {
		margin-top: 30px;
		border-top: dashed;
		padding-top: 20px;
	}
</style>
